/**
 * Created by DevilsEyes on 2016/3/6.
 */
//响应式布局

var layout = {
    "#banner": {
        "top": "-10~0"
    },
    "#body .text": {
        "margin-top": "85~110"
    },
    "#body .frame": {
        "padding-left": "50~70",
        "padding-right": "50~70",
        "padding-top": "40~60"
    },
    "footer": {
        "padding-top": "0~20"
    },
    "#dialog .frame": {
        "padding-left": "5~25",
        "padding-right": "5~25",
        "padding-top": "5~25"
    },
    "#dialog .text": {
        "margin-top": "50~80"
    },
    "#dialog .body>div": {
        "margin-top": '60~130'
    }
};

var set = {
    min: 320,
    max: 360,
    o: $(window).width()
};

var rate = (function () {
    if (set.o < set.min)return 0;
    if (set.o > set.max)return 1;
    return (set.o - set.min) / (set.max - set.min);
})();

$(document).ready(function () {
    var selector, $dom, allStyle, style, range, result, setStyle;
    for (selector in layout) {
        $dom = $(selector);
        allStyle = layout[selector];
        setStyle = {};
        for (style in allStyle) {
            range = allStyle[style].split('~');
            //字符串强转数字
            result = +range[0] + (range[1] - range[0]) * rate;
            setStyle[style] = result;
        }
        $dom.css(setStyle);

    }
});